<!DOCTYPE HTML>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>video</title>
    <script src="jquery-1.9.1.js"></script>
    <style type="text/css">
    </style>
</head>
<body>
<video id="myvideo2" src="/edu2-lesson/fl-down?name=102.mp4" controls="controls" width="480px"
       height="270px">
    your browser does not support the video tag
</video>
<video id="myvideo1" src="/edu2-lesson/video-fs-down/20190805/904af76b205e42588e24b4427b4a87bb.mp4" controls="controls" width="480px"
       height="270px" autoplay="autoplay">
    your browser does not support the video tag 20190802/102.mp4
</video>
<hr>
<button id="play">播放</button>
<button id="pause">暂停</button>
<button id="go10">快进10秒</button>
<button id="back10">快退10秒</button>
<button id="rate1">播放速度+</button>
<button id="rate0">播放速度-</button>
<button id="volume1">声音+</button>
<button id="volume0">声音-</button>
<button id="muted1">静音</button>
<button id="muted0">解除静音</button>
<button id="full">全屏</button>
</body>
<script>
    $(document).ready(function () {
        var video = $('#myvideo');

        $("#play").click(function () {
            video[0].play();
        });
        $("#pause").click(function () {
            video[0].pause();
        });
        $("#go10").click(function () {
            video[0].currentTime += 10;
        });
        $("#back10").click(function () {
            video[0].currentTime -= 10;
        });
        $("#rate1").click(function () {
            video[0].playbackRate += 2;
        });
        $("#rate0").click(function () {
            video[0].playbackRate -= 2;
        });
        $("#volume1").click(function () {
            video[0].volume += 0.1;
        });
        $("#volume0").click(function () {
            video[0].volume -= 0.1;
        });
        $("#muted1").click(function () {
            video[0].muted = true;
        });
        $("#muted0").click(function () {
            video[0].muted = false;
        });
        $("#full").click(function () {
            video[0].webkitEnterFullscreen(); // webkit类型的浏览器
            video[0].mozRequestFullScreen();  // FireFox浏览器
        });
    });

</script>
</html>